@extends('Admin.base')
@section('css')

@endsection
@section('style')

@endsection
@section('content')
    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto">
            <div class="layui-form-item layui-row">

                <div class="layui-inline layui-col-xs2 layui-col-sm2 layui-col-md2">
                    <label class="layui-form-label">姓名</label>
                    <div class="layui-input-block">
                        <input type="text" name="realname" placeholder="会员姓名" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline layui-col-xs2 layui-col-sm2 layui-col-md2">
                    <label class="layui-form-label">ID</label>
                    <div class="layui-input-block">
                        <input type="text" name="id" placeholder="ID" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline layui-col-xs2 layui-col-sm2 layui-col-md2">
                    <label class="layui-form-label">手机号</label>
                    <div class="layui-input-block">
                        <input type="text" name="phone" placeholder="手机号码" autocomplete="off" class="layui-input">
                    </div>
                </div>


                <div class="layui-inline layui-col-xs2 layui-col-sm2 layui-col-md2">
                    <label class="layui-form-label">部门</label>
                    <div class="layui-input-block">
                        <select name="department">
                            <option value=''>全部部门</option>
                            @foreach (\App\Models\UserDepartment::all() as $value)
                                <option value="{{$value->id}}">{{$value->department_name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="layui-inline layui-col-xs2 layui-col-sm2 layui-col-md2">
                    <label class="layui-form-label">状态</label>
                    <div class="layui-input-block">
                        <select name="status">
                            <option value=''>全部状态</option>
                            @foreach (\App\Models\User::USER_STATUS as $id => $name)
                                <option value="{{$id}}">{{$name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="layui-inline">
                    <div class="layui-btn-group layui-input-block">
                        <button class="layui-btn layui-btn-sm layui-input-block layuiadmin-btn-admin" lay-submit
                                lay-filter="LAY-search">
                            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-card-body">
            <table id="LAY-table" lay-filter="LAY-table"></table>

            <script type="text/html" id="tableToolbar">
                <a href="{{route('staff.edit')}}/@{{ d.id }}" class="layui-btn layui-btn-green layui-btn-sm">
                    编辑
                </a>
                <a href="{{route('staff.show')}}/@{{ d.id }}" class="layui-btn layui-btn-green layui-btn-sm">
                    查看
                </a>
            </script>

            <script type="text/html" id="toolbarDemo">
                <div class="layui-btn-container">
                    <a class="layui-btn" href="{{ route('staff.add') }}">添 加</a>
                </div>
            </script>
        </div>
    </div>
@endsection

@section('script')
    <script src="/js/ajax.js"></script>
    <script type="text/html" id="userInfo">
        <div>
            @{{d.nickname ? d.nickname : "" }}<br>@{{d.number ? d.number : ""}}
        </div>
    </script>
    <script>
        layui.use(['form', 'table', 'laydate'], function () {
            var $ = layui.$
                , form = layui.form
                , table = layui.table

            table.render({
                elem: '#LAY-table'
                , toolbar: '#toolbarDemo'
                , url: "{{url('/admin/staff/table')}}"
                , method: "post"
                , page: true //开启分页
                , limit: 10
                , cols: [[
                    {field: 'id', title: 'ID', width: 80}
                    , {field: 'realname', title: '姓名', width: 100}
                    , {field: 'sex_name', title: '性别', width: 80}
                    , {field: 'nickname', title: '会员信息', width: 200, templet: '#userInfo'}
                    , {field: 'created_at', title: '创建时间'}
                    , {field: 'position_name', title: '职位'}
                    , {field: 'status_name', title: '状态', width: 80}
                    , {field: 'department_name', title: '部门'}
                    , {field: 'phone', title: '手机号码'}
                    , {field: 'money_consh', title: '贝壳余额'}
                    , {field: 'user_has_invite_count', title: '会员数'}
                    , {fixed: 'right', title: '操作', width: 200, align: 'center', toolbar: '#tableToolbar'}
                ]]

            });


            //监听搜索
            form.on('submit(LAY-search)', function (data) {
                var field = data.field;
                //执行重载
                table.reload('LAY-table', {
                    where: field, page: {curr: 1}
                });
            });
        });
    </script>

@endsection